<!--
 * @Author: H.
 * @Date: 2022-01-25 15:23:07
 * @LastEditTime: 2022-02-09 09:53:19
 * @Description: 
-->
<template>
  <div>
    <jv-form :formObj="formObj"></jv-form>
    <Action
      :primary="[
        {
          label: '提交',
          confirm: submit
        }
      ]"
      :actions="[
        {
          label: '清空',
          confirm: reset
        }
      ]"
    >
    </Action>
  </div>
</template>

<script>
export default {
  data() {
    return {
      formObj: {}
    };
  },
  created() {
    this.formObj = this.$JForm({
      formSchema: [
        {
          prop: "name",
          label: "名称",
          cpn: "FormInput"
        },
        {
          prop: "sex",
          label: "性别",
          cpn: "FormInput"
        },
        {
          prop: "DateFormat",
          label: "日期格式",
          cpn: "FormSelect",
          options: {
            list: [
              {
                value: "yyyyMMdd",
                label: "yyyyMMdd"
              },
              {
                value: "yyMMdd",
                label: "yyMMdd"
              }
            ]
          }
        },
        {
          prop: "DeliveryDate",
          cpn: "SingleTime",
          label: "计划交期",
          rules: [
            {
              required: true,
              message: "请选择",
              trigger: ["change", "blur"]
            }
          ]
        }
      ],
      baseColProps: {
        span: 12
      },
      labelWidth: "80px",
      labelPosition: "top",
      gutter: 20
    });
  },
  methods: {
    submit() {
      this.formObj.validate((valid) => {
        if (valid) {
          alert("submit!");
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    reset() {
      this.formObj.reset();
    }
  }
};
</script>
